import 'package:flutter/material.dart';
import 'package:mall/constant/app_colors.dart';
import 'package:mall/modules/model/goods_detail_entity.dart';
import 'package:mall/ui/page/goods/widgets/goods_price_widget.dart';

class GoodsDetailPriceWidget extends StatelessWidget {
  const GoodsDetailPriceWidget({
    super.key,
    required this.model,
  });

  final GoodsDetailEntity model;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Stack(
          children: [
            _priceAndNum(),
            Positioned(
              bottom: 0,
              left: 0,
              right: 0,
              child: Container(
                height: 25,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.only(topLeft: Radius.circular(30), topRight: Radius.circular(30)),
                  color: Colors.white,
                ),
              ),
            ),
          ],
        ),

        //标题
        Padding(
          padding: const EdgeInsets.only(left: 15, right: 15),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              //商品名称
              Text(
                model.info?.name ?? "",
                style: TextStyle(
                  fontSize: 17,
                  color: AppColors.C_222222,
                  fontWeight: FontWeight.bold,
                ),
              ),
              SizedBox(height: 10),
              //商品参数
              model.attribute == null || model.attribute!.length == 0 ? Divider() : _attributeView(model),
            ],
          ),
        ),
      ],
    );
  }

  Container _priceAndNum() {
    return Container(
      height: 80,
      padding: EdgeInsets.only(left: 15, right: 15, top: 15),
      decoration: BoxDecoration(
        gradient: LinearGradient(
          colors: [
            Color(0xffFA2F3D),
            Color(0xffFE3985),
          ],
          begin: Alignment.centerLeft,
          end: Alignment.centerRight,
        ),
      ),
      child: Column(
        children: [
          Row(
            children: [
              //价格
              GoodsPriceWidget(price: model.info?.retailPrice ?? 0, priceColor: AppColors.C_FFFFFF),
              SizedBox(width: 10),
              //新品
              if (model.info?.isNew == 1)
                Container(
                  padding: EdgeInsets.only(left: 3, right: 3, top: 1, bottom: 1),
                  decoration: BoxDecoration(
                    border: Border.all(color: AppColors.C_FFFFFF, width: 1),
                    borderRadius: BorderRadius.circular(3),
                  ),
                  child: Text(
                    '新品',
                    style: TextStyle(
                      color: AppColors.C_FFFFFF,
                      fontSize: 9,
                    ),
                  ),
                ),
              //销量
              Spacer(),
              Text(
                '2.7千人购买',
                style: TextStyle(fontSize: 13, color: AppColors.C_FFFFFF),
              )
            ],
          ),
          Spacer(),
        ],
      ),
    );
  }

  //商品属性Widget
  Widget _attributeView(GoodsDetailEntity goodsDetail) {
    final list = goodsDetail.attribute ?? [];
    return ListView.builder(
        padding: EdgeInsets.zero,
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: list.length,
        itemBuilder: (BuildContext context, int index) {
          return _attributeItemView(list[index]);
        });
  }

  Widget _attributeItemView(GoodsDetailAttribute attribute) {
    return Container(
        margin: EdgeInsets.only(top: 5, bottom: 5),
        decoration: BoxDecoration(color: AppColors.C_F9F9F9, borderRadius: BorderRadius.circular(8)),
        padding: EdgeInsets.all(5),
        child: Row(
          children: <Widget>[
            Expanded(
              flex: 1,
              child: Text(attribute.attribute ?? "", style: TextStyle(fontSize: 13, color: AppColors.C_222222)),
            ),
            Expanded(
                flex: 3,
                child: Container(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    attribute.value ?? "",
                    style: TextStyle(fontSize: 13, color: AppColors.C_9D9D9D),
                  ),
                )),
          ],
        ));
  }
}
